import React, { lazy, Suspense } from 'react'
import history from '@/utils/history'
import { Router, Route, Switch, Redirect } from 'react-router-dom'
import AuthRoute from './components/AuthRoute'
// import Login from '@/pages/Login'
// import Layout from '@/pages/Layout'
// import NotFound from '@/pages/NotFound'
const Login = lazy(() => import('@/pages/Login'))
const Layout = lazy(() => import('@/pages/Layout'))
const NotFound = lazy(() => import('@/pages/NotFound'))
export default function App () {
  return (
    <Router history={history}>
      <Suspense
        fallback={
          <div
            style={{
              textAlign: 'center',
              marginTop: 200
            }}>
            loading...
          </div>
        }>
        <div className="app">
          <Switch>
            <Redirect from="/" exact to="/login" />
            <Route path="/login" component={Login} />
            <AuthRoute path="/home" component={Layout} />
            {/* 增加一个404 */}
            <Route component={NotFound} />
          </Switch>
        </div>
      </Suspense>
    </Router>
  )
}
